<template>
  <el-card shadow="hover">
    <div class="home_container">
      <el-image class="img" :src="user.avatar" fit="cover" />
      <div>
        <h4>中午好{{ user.username }}</h4>
        <div class="home_title">硅谷甄选运营平台</div>
      </div>
    </div>
  </el-card>
  <img src="@/assets/images/home_bg.jpg" style="width: 100%; margin-top: 10px" alt="" />
</template>

<script setup lang="ts">
import { userStore } from '@/store/user'
const user = userStore()
</script>

<style scoped lang="scss">
.home_container {
  display: flex;
  .img {
    width: 100px;
    height: 100px;
    margin-right: 20px;
    border-radius: 50%;
  }
  .home_title {
    color: rgb(174, 157, 157);
  }
}
.home_img {
  width: 100%;
  height: 500px;
  background: url('../../assets/images/home_bg.jpg') no-repeat;
  background-size: cover;
}
</style>
